<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="Cache-Control" content="no-siteapp">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
    
    <meta name="referrer" content="no-referrer-when-downgrade">
    
    <meta name="renderer" content="webkit"/>
    <meta name="force-rendering" content="webkit"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    <script>if (/*@cc_on!@*/false || (!!window.MSInputMethodContext && !!document.documentMode)) window.location.href="https://support.dmeng.net/upgrade-your-browser.html?referrer="+encodeURIComponent(window.location.href); </script>
    
    
        <link rel="preload" crossorigin="crossorigin" href="/fonts/roboto/Roboto-Regular.woff2" as="font">
        <link rel="preload" crossorigin="crossorigin" href="/fonts/roboto/Roboto-Bold.woff2" as="font">
    
    
    
        <link rel="shortcut icon" href="/icons/favicon.ico">
    

    
    
        
<link rel="stylesheet" href="/css/mdui.min.v1.0.0.css">

    
    
<link rel="stylesheet" href="/css/main.css">
<link rel="stylesheet" href="/css/iconfont.css">


    
    

    
        <script data-ad-client="ca-" async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
    












    
        <script>
  if (typeof MathJax === 'undefined') {
    window.MathJax = {
      loader: {
        
            load: ['[tex]/mhchem'],
        
        source: {
          '[tex]/amsCd': '[tex]/amscd',
          '[tex]/AMScd': '[tex]/amscd'
        }
      },
      tex: {
        inlineMath: {'[+]': [['$', '$']]},
        
            packages: {'[+]': ['mhchem']},
        
        tags: 'ams'
      },
      options: {
        renderActions: {
          findScript: [10, doc => {
            document.querySelectorAll('script[type^="math/tex"]').forEach(node => {
              const display = !!node.type.match(/; *mode=display/);
              const math = new doc.options.MathItem(node.textContent, doc.inputJax[0], display);
              const text = document.createTextNode('');
              node.parentNode.replaceChild(text, node);
              math.start = {node: text, delim: '', n: 0};
              math.end = {node: text, delim: '', n: 0};
              doc.math.push(math);
            });
          }, '', false],
          insertedScript: [200, () => {
            document.querySelectorAll('mjx-container').forEach(node => {
              let target = node.parentNode;
              if (target.nodeName.toLowerCase() === 'li') {
                target.parentNode.classList.add('has-jax');
              }
            });
          }, '', false]
        }
      }
    };
    (function () {
      var script = document.createElement('script');
      script.src = 'https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js';
      script.defer = true;
      document.head.appendChild(script);
    })();
  } else {
    MathJax.startup.document.state(0);
    MathJax.texReset();
    MathJax.typeset();
  }
</script>
          


    
    
    <title>
          
            吴豪阳的数据库
        
    </title>
    
    
<meta name="generator" content="Hexo 5.4.1"></head>
<body class="mdui-drawer-body-left mdui-appbar-with-toolbar mdui-theme-primary-teal mdui-theme-accent-blue">
  
  <header class="mdui-appbar mdui-appbar-fixed">
  <div id="toolbar" class="mdui-toolbar mdui-color-theme">
    <button class="mdui-btn mdui-btn-icon" mdui-drawer="{target: '#sidebar', swipe: true}"><i class="iconfont icon-menu"></i></button>
    <a href="/" class="mdui-typo-headline">吴豪阳的数据库</a>
    <a href="/" class="header-subtitle mdui-typo-headline"></a>
    <div class="mdui-toolbar-spacer"></div>
    <button class="mdui-btn mdui-btn-icon" mdui-dialog="{target: '#search'}" mdui-tooltip="{content: 'search'}"><i class="iconfont icon-search"></i></button>
  </div>
</header>

<div class="mdui-dialog" id="search">
  
    <div class="search-form">
      <input type="search" class="search-form-input" placeholder="请输入关键字" onfocus="listenSearchFunc()">
    </div>
    <div class="search-result" data-resource="/search.xml"></div>
  
</div>

  <aside id="sidebar" class="mdui-drawer">
    <div class="mdui-tab" mdui-tab>
        <a href="#sidebar-tab1" id="sidebartab" class="mdui-ripple mdui-tab-active">站点概览</a>
        <a href="#sidebar-tab2" id="sidebartab" class="mdui-ripple">关于</a>
    </div>

    
    <div id="sidebar-tab1" class="mdui-p-a-1">
        <div class="mdui-list">
            
                
                <a href="/" class="mdui-list-item mdui-ripple">
                    <div class="mdui-list-item-icon">
                        <i class="iconfont icon-home"></i>
                    </div>
                    <div class="mdui-list-item-content">主页</div>
                </a>
            
                
                <a href="/tags/" class="mdui-list-item mdui-ripple">
                    <div class="mdui-list-item-icon">
                        <i class="iconfont icon-bookmark"></i>
                    </div>
                    <div class="mdui-list-item-content">标签</div>
                </a>
            
                
                <a href="/categories/" class="mdui-list-item mdui-ripple">
                    <div class="mdui-list-item-icon">
                        <i class="iconfont icon-folder"></i>
                    </div>
                    <div class="mdui-list-item-content">分类</div>
                </a>
            
                
                <a href="/archives/" class="mdui-list-item mdui-ripple">
                    <div class="mdui-list-item-icon">
                        <i class="iconfont icon-archive"></i>
                    </div>
                    <div class="mdui-list-item-content">归档</div>
                </a>
            
                
                <a href="/tools/" class="mdui-list-item mdui-ripple">
                    <div class="mdui-list-item-icon">
                        <i class="iconfont icon-tools"></i>
                    </div>
                    <div class="mdui-list-item-content">工具箱</div>
                </a>
            
                
                <a href="/about/" class="mdui-list-item mdui-ripple">
                    <div class="mdui-list-item-icon">
                        <i class="iconfont icon-user"></i>
                    </div>
                    <div class="mdui-list-item-content">关于</div>
                </a>
            
            <div class="mdui-list-item mdui-ripple">
                <div class="mdui-list-item-icon">
                    <i class="iconfont icon-moon"></i>
                </div>
                <div class="mdui-list-item-content">夜间模式</div>
                <label class="mdui-switch" id="darkmode">
                  <input type="checkbox" id="nightmode_switch"/>
                  <i class="mdui-switch-icon"></i>
                </label>
            </div>           
        </div>
    </div>

    
    <div id="sidebar-tab2" class="mdui-p-a-1">
        <div class="sidebar-overview">
            <div class="sidebar-avatar">
                
                    <img src="/icons/avatar.gif"/>
                
            </div>
            <div class="sidebar-author-name">John Doe</div>
            <div class="sidebar-description"></div>
        </div>
        <div class="sidebar-links">
            
                
                <div class="mdui-chip">
                    <span class="mdui-chip-icon"><i class="iconfont icon-mail"></i></span>
                    <a href="mailto:xxx@xxx.com" class="mdui-chip-title">E-Mail</a>
                </div>
            
                
                <div class="mdui-chip">
                    <span class="mdui-chip-icon"><i class="iconfont icon-github"></i></span>
                    <a target="_blank" rel="noopener" href="https://your.url" class="mdui-chip-title">GitHub</a>
                </div>
            
                
                <div class="mdui-chip">
                    <span class="mdui-chip-icon"><i class="iconfont icon-steam"></i></span>
                    <a target="_blank" rel="noopener" href="https://your.url" class="mdui-chip-title">Steam</a>
                </div>
            
                
                <div class="mdui-chip">
                    <span class="mdui-chip-icon"><i class="iconfont icon-weibo"></i></span>
                    <a target="_blank" rel="noopener" href="https://your.url" class="mdui-chip-title">Weibo</a>
                </div>
            
        </div>
        <ul class="mdui-list" mdui-collapse="{accordion: true}">
            <li class="mdui-collapse-item">
                <div class="mdui-collapse-item-header mdui-list-item mdui-ripple">
                    <div class="mdui-list-item-icon">
                        <i class="iconfont icon-link"></i>
                    </div>
                    <div class="mdui-list-item-content">友情链接</div>
                    <div class="mdui-collapse-item-arrow">
                        <i class="mdui-list-item-icon iconfont icon-angle-down"></i>
                    </div>
                </div>
                <ul id="linksList" class="mdui-collapse-item-body mdui-list mdui-list-dense">
                    
                        <a target="_blank" rel="noopener" href="https://garybear.cn/hexo-theme-meadow/" class="mdui-list-item mdui-ripple">
                            Meadow说明文档
                        </a>
                    
                </ul>
            </li>
        </ul>
    </div>

    <div class="mdui-divider"></div>
    
    
</aside>
  
  <main id="main-contain" class="mdui-container mdui-m-t-5">
    
    <article class="mdui-card mdui-m-b-5 mdui-hoverable">    
      
      
        <div class="post-header"> 
  <a class="post-header-title" href="/2022/03/09/%E9%A1%B9%E7%9B%AE%E5%B8%B8%E7%94%A8%E7%9A%84%E4%B8%80%E4%BA%9B%E6%96%B9%E6%B3%95/%E5%9B%BE%E7%89%87%E6%88%AA%E5%88%87/">surce</a>
  <div class="post-header-meta">
    <span>
      <span class="iconfont icon-calendar"></span>
      发布于:&nbsp;2022-03-09
    </span>
    <span>
      <span class="iconfont icon-calendar-check"></span>
      更新于:&nbsp;2022-03-09
    </span>
    <span>
      <span class="iconfont icon-folder"></span>
      分类于:&nbsp;<a class="category-link" href="/categories/%E5%88%86%E7%B1%BB/">分类</a>
    </span>
    
  </div>
</div>   
    



      
      
  <div class="post-tags">
    
      <i class="iconfont icon-tag">
        <a rel="tag" href = /tags/blog/ >blog</a>
      </i>
    
  </div>

      
      <div id="achieve-abstract" class="mdui-card-content mdui-p-x-4">
        <div class="post-abstract mdui-typo ">
          
            <h2 id="利用vant-里面的组件"><a href="#利用vant-里面的组件" class="headerlink" title="利用vant 里面的组件"></a>利用vant 里面的组件</h2><pre><code>&lt;!-- 利用这个组件 --&gt;
&lt;template&gt;

&lt;van-uploader :after-read=&quot;afterRead&quot; /&gt;
   &lt;ImgCutter v-on:cutDown=&quot;cutDown&quot;&gt;

      &lt;template #open&gt...
          
        </div>
        
        <div style="text-align:center;">
          <a class="post-readmore mdui-btn mdui-ripple mdui-btn-raised" href="/2022/03/09/%E9%A1%B9%E7%9B%AE%E5%B8%B8%E7%94%A8%E7%9A%84%E4%B8%80%E4%BA%9B%E6%96%B9%E6%B3%95/%E5%9B%BE%E7%89%87%E6%88%AA%E5%88%87/">阅读更多</a>
        </div>
      </div>
    </article>

    <article class="mdui-card mdui-m-b-5 mdui-hoverable">    
      
      
        <div class="post-header"> 
  <a class="post-header-title" href="/2022/03/09/%E9%A1%B9%E7%9B%AE%E5%B8%B8%E7%94%A8%E7%9A%84%E4%B8%80%E4%BA%9B%E6%96%B9%E6%B3%95/%E9%A1%B9%E7%9B%AE%E7%9A%84%E4%BC%98%E5%8C%96/">项目的优化</a>
  <div class="post-header-meta">
    <span>
      <span class="iconfont icon-calendar"></span>
      发布于:&nbsp;2022-03-09
    </span>
    <span>
      <span class="iconfont icon-calendar-check"></span>
      更新于:&nbsp;2022-03-09
    </span>
    <span>
      <span class="iconfont icon-folder"></span>
      分类于:&nbsp;<a class="category-link" href="/categories/%E5%88%86%E7%B1%BB/">分类</a>
    </span>
    
  </div>
</div>   
    



      
      
  <div class="post-tags">
    
      <i class="iconfont icon-tag">
        <a rel="tag" href = /tags/blog/ >blog</a>
      </i>
    
  </div>

      
      <div id="achieve-abstract" class="mdui-card-content mdui-p-x-4">
        <div class="post-abstract mdui-typo ">
          
            <h2 id="vant优化"><a href="#vant优化" class="headerlink" title="vant优化"></a>vant优化</h2><h3 id="1-下载-babel-插件"><a href="#1-下载-babel-插件" class="headerlink" title="1. 下载  babel  插件"></a>1. 下载  babel  插件</h3><p>    npm i babel-plugin-import -D</p>
<h3 id="2-在-babelrc-中添加配置"><a href="#2-在-babelrc-中添加配置" c...
          
        </div>
        
        <div style="text-align:center;">
          <a class="post-readmore mdui-btn mdui-ripple mdui-btn-raised" href="/2022/03/09/%E9%A1%B9%E7%9B%AE%E5%B8%B8%E7%94%A8%E7%9A%84%E4%B8%80%E4%BA%9B%E6%96%B9%E6%B3%95/%E9%A1%B9%E7%9B%AE%E7%9A%84%E4%BC%98%E5%8C%96/">阅读更多</a>
        </div>
      </div>
    </article>

    <article class="mdui-card mdui-m-b-5 mdui-hoverable">    
      
      
        <div class="post-header"> 
  <a class="post-header-title" href="/2022/03/08/%E9%A1%B9%E7%9B%AE%E5%B8%B8%E7%94%A8%E7%9A%84%E4%B8%80%E4%BA%9B%E6%96%B9%E6%B3%95/%E5%85%A8%E5%B1%80%E8%B7%AF%E7%94%B1%E5%AE%88%E5%8D%AB/">全局路由守卫</a>
  <div class="post-header-meta">
    <span>
      <span class="iconfont icon-calendar"></span>
      发布于:&nbsp;2022-03-08
    </span>
    <span>
      <span class="iconfont icon-calendar-check"></span>
      更新于:&nbsp;2022-03-09
    </span>
    <span>
      <span class="iconfont icon-folder"></span>
      分类于:&nbsp;<a class="category-link" href="/categories/%E5%88%86%E7%B1%BB/">分类</a>
    </span>
    
  </div>
</div>   
    



      
      
  <div class="post-tags">
    
      <i class="iconfont icon-tag">
        <a rel="tag" href = /tags/blog/ >blog</a>
      </i>
    
  </div>

      
      <div id="achieve-abstract" class="mdui-card-content mdui-p-x-4">
        <div class="post-abstract mdui-typo ">
          
            <p> <code>在路由内定义一个 属性</code></p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><span class="line">mate:&#123;</span><br><span class="line">  //true 是登录之后才可以 访问</span><br><span class="line">  //false 是登录之后不可以 访问</span><br><span class="line">  auth:true/false </span><br><span class="line"></span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>
          
        </div>
        
        <div style="text-align:center;">
          <a class="post-readmore mdui-btn mdui-ripple mdui-btn-raised" href="/2022/03/08/%E9%A1%B9%E7%9B%AE%E5%B8%B8%E7%94%A8%E7%9A%84%E4%B8%80%E4%BA%9B%E6%96%B9%E6%B3%95/%E5%85%A8%E5%B1%80%E8%B7%AF%E7%94%B1%E5%AE%88%E5%8D%AB/">阅读更多</a>
        </div>
      </div>
    </article>

    <article class="mdui-card mdui-m-b-5 mdui-hoverable">    
      
      
        <div class="post-header"> 
  <a class="post-header-title" href="/2022/03/07/%E8%A1%8C%E4%B8%9A%E6%8A%A5%E5%91%8A/VUE/">VUE</a>
  <div class="post-header-meta">
    <span>
      <span class="iconfont icon-calendar"></span>
      发布于:&nbsp;2022-03-07
    </span>
    <span>
      <span class="iconfont icon-calendar-check"></span>
      更新于:&nbsp;2022-03-07
    </span>
    <span>
      <span class="iconfont icon-folder"></span>
      分类于:&nbsp;<a class="category-link" href="/categories/%E5%88%86%E7%B1%BB/">分类</a>
    </span>
    
  </div>
</div>   
    



      
      
  <div class="post-tags">
    
      <i class="iconfont icon-tag">
        <a rel="tag" href = /tags/blog/ >blog</a>
      </i>
    
  </div>

      
      <div id="achieve-abstract" class="mdui-card-content mdui-p-x-4">
        <div class="post-abstract mdui-typo ">
          
            <p> <code>一、门槛低、上手快</code></p>
<p> <code>Vue 上手简单的原因是无需复杂配置，只需要一个 HTML 与相关文件就能跑起来。从设计的角度上来看，Vue 考虑的也是如何降低门槛，让只掌握了 Web 基础知识 (HTML, CSS, JS) 的情况下，能够最快理解和上手，从而实现和完成一个应用。</code></p>
<p> <code>和 React、Angular 相比，Vue 的中文文档是写的最好的，再加上国内有非常丰富的视频、图文教程、各种开源的插件，哪怕是一个新手前端开发，学习一周左右就可以搞一个项目出来。就如我们开头所说，配合第三方前端表格...
          
        </div>
        
        <div style="text-align:center;">
          <a class="post-readmore mdui-btn mdui-ripple mdui-btn-raised" href="/2022/03/07/%E8%A1%8C%E4%B8%9A%E6%8A%A5%E5%91%8A/VUE/">阅读更多</a>
        </div>
      </div>
    </article>

    <article class="mdui-card mdui-m-b-5 mdui-hoverable">    
      
      
        <div class="post-header"> 
  <a class="post-header-title" href="/2022/03/07/%E9%A1%B9%E7%9B%AE%E5%B8%B8%E7%94%A8%E7%9A%84%E4%B8%80%E4%BA%9B%E6%96%B9%E6%B3%95/filters/">全局过滤器</a>
  <div class="post-header-meta">
    <span>
      <span class="iconfont icon-calendar"></span>
      发布于:&nbsp;2022-03-07
    </span>
    <span>
      <span class="iconfont icon-calendar-check"></span>
      更新于:&nbsp;2022-03-07
    </span>
    <span>
      <span class="iconfont icon-folder"></span>
      分类于:&nbsp;<a class="category-link" href="/categories/%E5%88%86%E7%B1%BB/">分类</a>
    </span>
    
  </div>
</div>   
    



      
      
  <div class="post-tags">
    
      <i class="iconfont icon-tag">
        <a rel="tag" href = /tags/blog/ >blog</a>
      </i>
    
  </div>

      
      <div id="achieve-abstract" class="mdui-card-content mdui-p-x-4">
        <div class="post-abstract mdui-typo ">
          
            <figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br></pre></td><td class="code"><pre><span class="line">// 全局过滤器</span><br><span class="line">import Vue from &quot;vue&quot;;</span><br><span class="line">// 取小数位</span><br><span class="line">&lt;!-- float定义过滤器的名字 --&gt;</span><br><span class="line">Vue.filter(&quot;float&quot;, (n, set) =&gt; &#123;</span><br><span class="line">  // 1. 判断</span><br><span class="line">  //isFinite() 函数用来判断被传入的参数值是否为一个有限数值（</span><br><span class="line">  if (isFinite(n)) &#123;</span><br><span class="line">    &lt;!-- toFixed() 方法可把 数字 四舍五入为指定小数位数的数字。 --&gt;</span><br><span class="line">    return Number(n).toFixed(set || 2);</span><br><span class="line">  &#125; else &#123;</span><br><span class="line">    return n;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;);</span><br></pre></td></tr></table></figure>
          
        </div>
        
        <div style="text-align:center;">
          <a class="post-readmore mdui-btn mdui-ripple mdui-btn-raised" href="/2022/03/07/%E9%A1%B9%E7%9B%AE%E5%B8%B8%E7%94%A8%E7%9A%84%E4%B8%80%E4%BA%9B%E6%96%B9%E6%B3%95/filters/">阅读更多</a>
        </div>
      </div>
    </article>

    <article class="mdui-card mdui-m-b-5 mdui-hoverable">    
      
      
        <div class="post-header"> 
  <a class="post-header-title" href="/2022/03/07/%E9%A1%B9%E7%9B%AE%E5%B8%B8%E7%94%A8%E7%9A%84%E4%B8%80%E4%BA%9B%E6%96%B9%E6%B3%95/%E8%AE%A1%E7%AE%97/">computed</a>
  <div class="post-header-meta">
    <span>
      <span class="iconfont icon-calendar"></span>
      发布于:&nbsp;2022-03-07
    </span>
    <span>
      <span class="iconfont icon-calendar-check"></span>
      更新于:&nbsp;2022-03-10
    </span>
    <span>
      <span class="iconfont icon-folder"></span>
      分类于:&nbsp;<a class="category-link" href="/categories/%E5%88%86%E7%B1%BB/">分类</a>
    </span>
    
  </div>
</div>   
    



      
      
  <div class="post-tags">
    
      <i class="iconfont icon-tag">
        <a rel="tag" href = /tags/blog/ >blog</a>
      </i>
    
  </div>

      
      <div id="achieve-abstract" class="mdui-card-content mdui-p-x-4">
        <div class="post-abstract mdui-typo ">
          
            <p> <code>price这个名字绑定给总价</code></p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line">computed: &#123;</span><br><span class="line"></span><br><span class="line">   //结算总价</span><br><span class="line">   price() &#123;</span><br><span class="line">     return (</span><br><span class="line">       this.getCart</span><br><span class="line">         .filter((item) =&gt; item.flag)</span><br><span class="line">         .reduce((a, b) =&gt; &#123;</span><br><span class="line">           return a + b.count * b.price;</span><br><span class="line">         &#125;, 0) * 100 </span><br><span class="line">     );</span><br><span class="line">   &#125;</span><br><span class="line"></span><br></pre></td></tr></table></figure>
          
        </div>
        
        <div style="text-align:center;">
          <a class="post-readmore mdui-btn mdui-ripple mdui-btn-raised" href="/2022/03/07/%E9%A1%B9%E7%9B%AE%E5%B8%B8%E7%94%A8%E7%9A%84%E4%B8%80%E4%BA%9B%E6%96%B9%E6%B3%95/%E8%AE%A1%E7%AE%97/">阅读更多</a>
        </div>
      </div>
    </article>

    <article class="mdui-card mdui-m-b-5 mdui-hoverable">    
      
      
        <div class="post-header"> 
  <a class="post-header-title" href="/2022/03/07/%E5%AE%A2%E6%9C%8D/%E5%AE%A2%E6%9C%8D/">客服</a>
  <div class="post-header-meta">
    <span>
      <span class="iconfont icon-calendar"></span>
      发布于:&nbsp;2022-03-07
    </span>
    <span>
      <span class="iconfont icon-calendar-check"></span>
      更新于:&nbsp;2022-03-07
    </span>
    <span>
      <span class="iconfont icon-folder"></span>
      分类于:&nbsp;<a class="category-link" href="/categories/%E5%88%86%E7%B1%BB/">分类</a>
    </span>
    
  </div>
</div>   
    



      
      
  <div class="post-tags">
    
      <i class="iconfont icon-tag">
        <a rel="tag" href = /tags/blog/ >blog</a>
      </i>
    
  </div>

      
      <div id="achieve-abstract" class="mdui-card-content mdui-p-x-4">
        <div class="post-abstract mdui-typo ">
          
            
          
        </div>
        
        <div style="text-align:center;">
          <a class="post-readmore mdui-btn mdui-ripple mdui-btn-raised" href="/2022/03/07/%E5%AE%A2%E6%9C%8D/%E5%AE%A2%E6%9C%8D/">阅读更多</a>
        </div>
      </div>
    </article>

    <article class="mdui-card mdui-m-b-5 mdui-hoverable">    
      
      
        <div class="post-header"> 
  <a class="post-header-title" href="/2022/03/06/%E8%A1%8C%E4%B8%9A%E6%8A%A5%E5%91%8A/JQuery/">jQuery</a>
  <div class="post-header-meta">
    <span>
      <span class="iconfont icon-calendar"></span>
      发布于:&nbsp;2022-03-06
    </span>
    <span>
      <span class="iconfont icon-calendar-check"></span>
      更新于:&nbsp;2022-03-06
    </span>
    <span>
      <span class="iconfont icon-folder"></span>
      分类于:&nbsp;<a class="category-link" href="/categories/%E5%88%86%E7%B1%BB/">分类</a>
    </span>
    
  </div>
</div>   
    



      
      
  <div class="post-tags">
    
      <i class="iconfont icon-tag">
        <a rel="tag" href = /tags/blog/ >blog</a>
      </i>
    
  </div>

      
      <div id="achieve-abstract" class="mdui-card-content mdui-p-x-4">
        <div class="post-abstract mdui-typo ">
          
            <h3 id="jQuery-如何获取元素"><a href="#jQuery-如何获取元素" class="headerlink" title="jQuery 如何获取元素"></a>jQuery 如何获取元素</h3><p><code>jQuery的基本设计思想和主要用法，就是&quot;选择某个网页元素，然后对其进行某种操作&quot;。这是它区别于其他Javascript库的根本特点</code> 。</p>
<p><code>使用jQuery的第一步，往往就是将一个选择表达式，放进构造函数jQuery()（简写为$），然后得到被选中的元素</code> 。</p>
<p><co...
          
        </div>
        
        <div style="text-align:center;">
          <a class="post-readmore mdui-btn mdui-ripple mdui-btn-raised" href="/2022/03/06/%E8%A1%8C%E4%B8%9A%E6%8A%A5%E5%91%8A/JQuery/">阅读更多</a>
        </div>
      </div>
    </article>

    <article class="mdui-card mdui-m-b-5 mdui-hoverable">    
      
      
        <div class="post-header"> 
  <a class="post-header-title" href="/2022/03/06/%E8%A1%8C%E4%B8%9A%E6%8A%A5%E5%91%8A/%E6%9C%89%E5%85%B3vue/">有关Vue</a>
  <div class="post-header-meta">
    <span>
      <span class="iconfont icon-calendar"></span>
      发布于:&nbsp;2022-03-06
    </span>
    <span>
      <span class="iconfont icon-calendar-check"></span>
      更新于:&nbsp;2022-03-06
    </span>
    <span>
      <span class="iconfont icon-folder"></span>
      分类于:&nbsp;<a class="category-link" href="/categories/%E5%88%86%E7%B1%BB/">分类</a>
    </span>
    
  </div>
</div>   
    



      
      
  <div class="post-tags">
    
      <i class="iconfont icon-tag">
        <a rel="tag" href = /tags/blog/ >blog</a>
      </i>
    
  </div>

      
      <div id="achieve-abstract" class="mdui-card-content mdui-p-x-4">
        <div class="post-abstract mdui-typo ">
          
            <h1 id="Vue-js"><a href="#Vue-js" class="headerlink" title="Vue.js"></a>Vue.js</h1><p> <code>Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式JavaScript框架。  与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用（SPA）提供驱动。</code></p>
<p> <code>软件名...
          
        </div>
        
        <div style="text-align:center;">
          <a class="post-readmore mdui-btn mdui-ripple mdui-btn-raised" href="/2022/03/06/%E8%A1%8C%E4%B8%9A%E6%8A%A5%E5%91%8A/%E6%9C%89%E5%85%B3vue/">阅读更多</a>
        </div>
      </div>
    </article>

    <article class="mdui-card mdui-m-b-5 mdui-hoverable">    
      
      
        <div class="post-header"> 
  <a class="post-header-title" href="/2022/03/06/JQ/jq%E7%9A%84%E6%96%B9%E6%B3%95/">JQ</a>
  <div class="post-header-meta">
    <span>
      <span class="iconfont icon-calendar"></span>
      发布于:&nbsp;2022-03-06
    </span>
    <span>
      <span class="iconfont icon-calendar-check"></span>
      更新于:&nbsp;2022-03-06
    </span>
    <span>
      <span class="iconfont icon-folder"></span>
      分类于:&nbsp;<a class="category-link" href="/categories/%E5%88%86%E7%B1%BB/">分类</a>
    </span>
    
  </div>
</div>   
    



      
      
  <div class="post-tags">
    
      <i class="iconfont icon-tag">
        <a rel="tag" href = /tags/blog/ >blog</a>
      </i>
    
  </div>

      
      <div id="achieve-abstract" class="mdui-card-content mdui-p-x-4">
        <div class="post-abstract mdui-typo ">
          
            <p>JQ 官网</p>
<!-- https://www.w3school.com.cn/jquery/jquery_fade.asp -->

<h3 id="jQuery-遍历函数"><a href="#jQuery-遍历函数" class="headerlink" title="jQuery 遍历函数"></a>jQuery 遍历函数</h3><p>jQuery 遍历函数包括了用于筛选、查找和串联元素的方法。</p>
<p>函数    描述<br> <code>.add()    将元素添加到匹配元素的集合中。</code></p>
<p> <code>.andSelf()   ...
          
        </div>
        
        <div style="text-align:center;">
          <a class="post-readmore mdui-btn mdui-ripple mdui-btn-raised" href="/2022/03/06/JQ/jq%E7%9A%84%E6%96%B9%E6%B3%95/">阅读更多</a>
        </div>
      </div>
    </article>



  <nav style="text-align: center;">
    <div class="pagination">
      <a class="extend prev" rel="prev" href="/"><i class="iconfont icon-angle-left"></i></a><a class="page-number" href="/">1</a><span class="page-number current">2</span><a class="page-number" href="/page/3/">3</a><a class="page-number" href="/page/4/">4</a><a class="page-number" href="/page/5/">5</a><a class="extend next" rel="next" href="/page/3/"><i class="iconfont icon-angle-right"></i></a>
    </div>
  </nav>

  </main>
  <footer id="footer" class="mdui-text-center mdui-m-t-5 mdui-p-b-2 mdui-p-t-4 mdui-color-theme">
  <div class="mdui-container">
    <div class="mdui-row">
      
        <a href="https://beian.miit.gov.cn" rel="noopener" target="_blank"></a>
      
      <span>
        &copy; 2015 - 2022 
        
          <span style="color:#d9333f" class="iconfont icon-heart"></span>
        
        John Doe
      </span>
    </div>
    <div class="mdui-row">
      
        <div class="mdui-col-xs-6 mdui-text-right">
          <span>Powered by <a href="https://hexo.io/" rel="noopener" target="_blank">Hexo</a></span>
        </div>
        <div class="mdui-col-xs-6 mdui-text-left">
          <span>Theme: <a href="https://github.com/kb1000fx/Meadow" rel="noopener" target="_blank">Meadow</a></span>
        </div>
      
    </div>
    <div class="mdui-row">
      
        <div class="mdui-col-xs-6 mdui-text-right">
          <span id="busuanzi_container_site_uv" style="display: none;"> <span class="iconfont icon-user"></span>总访客量 <span id="busuanzi_value_site_uv"></span></span>
        </div>
        <div class="mdui-col-xs-6 mdui-text-left">
          <span id="busuanzi_container_site_pv" style="display: none;"> <span class="iconfont icon-eye"></span>总访问量 <span id="busuanzi_value_site_pv"></span></span>
        </div>
      
    </div>
 </div>
</footer>
  
  <button id="gotop" class="mdui-fab mdui-fab-fixed mdui-fab-hide mdui-ripple mdui-color-teal" style="z-index:100;"><i class="iconfont icon-arrowup"></i></button>
  
  

    <script async src="https://busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js"></script>







    
<script src="/js/mdui.min.v1.0.0.js"></script>




<script src="/js/meadow.js"></script>

</body>
</html >